import Vue from "vue";
import VueRouter from "vue-router";
import routes from "./routes";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
import store from "@/store"

Vue.use(VueRouter);

const router = new VueRouter({
  mode: "history",
  routes,
  scrollBehavior() {
    return {
      x: 0,
      y: 0,
    };
  },
});
/* 
### 路由鉴权的过程（免密登录、token校验）
先判断是否存在token
  -如果存在token
    *判断我们去的是不是登陆页，如果是，则直接导航到首页
    *判断用户名是否存在
      +如果存在
      说明用户刚刚登录过，不需要再鉴权（因为只要页面一刷新或者重新打开，则用户名就会消失）所以直接放行
      +如果不存在
      拿到token去请求用户信息
      如果请求用户信息成功，则直接放行
      如果请求用户信息失败，则说明token过期或者被篡改，此时就要直接跳转到登陆页（并且一定要删除token）


      如果token不存在
        *判断当前要去的页面是不是必须要登录才能访问的
          +如果是：则跳转到登录页让用户登录
          +如果不是，则直接放行
 */

  // 设置一份白名单，白名单保存的时候不需要token校验就能访问路由
  const whiteArr = ["Home", "Login", "Register", "Search", "Detail"]



//使用全局前置守卫
router.beforeEach(async(to, from, next) => {
  // 路由跳转的时候开启进度条
  NProgress.start();

  // 获取token
  const token = store.state.User.token
  if(token){
    // 判断我们去的是不是登录页，如果是，则直接导航到首页
    if(to.name === "Login"){
      next("/home")
    }else{
      // 判断用户名是否存在
      const isHaseNickName = !!store.state.User.userMessage.nickName
      if(isHaseNickName){
        // 如果存在说明用户刚刚登录过，不需要再鉴权（因为只要页面一刷新或者重新打开，则用户名就会消失）所以直接放行
        next();
      }else{
        //要异常捕获,一旦请求用户信息失败,则说明当前的token是失效的或者是过期的
        try {
          //如果不存在,拿到token去请求用户信息
          await store.dispatch("User/getUserMessage");
          //加入请求成功,则直接放行
          next();
        }catch(e){
          //说明token异常,此时就要直接跳转到登录页(并且一定要删除token)
          store.commit("User/remove_Token");
          next("/login");
        }
      }
    }
  }else {
    //如果token不存在,判断当前要去的页面是不是必须登录才能访问的(判断要去的页面在白名单中,则直接放行)
    if (whiteArr.includes(to.name)) {
      next();
    } else {
      //如果要去的地方必须要使用token,则立马跳转到登录页
      next("/login");
    }
  }
  next();
});

//使用全局后置钩子配置关闭进度条
router.afterEach(() => {
  NProgress.done();
});

export default router;
